<template>
  <Select v-model="innerValue" placeholder="请选择节点类型" style="width: 100%">
    <SelectOption v-for="item in userTypes" :value="item.userTaskTypeValue">
      {{ item.userTaskTypeTitle }}
    </SelectOption>
  </Select>
</template>
<script>
import {createProps} from '@/utils';
import {Select} from 'ant-design-vue';

export default {
  name: 'UserTaskTypeSelector',
  components: {
    Select,
    SelectOption: Select.Option,
  },
  model: {
    prop: 'value',
    event: 'change',
  },
  props: {
    service: {
      type: Function,
      default: () => undefined
    },
    value: createProps(String),
    defaultValue: createProps(String),
  },
  data() {
    return {
      userTypes: [],
    };
  },
  mounted() {
    this.loadUserTaskTypes();
  },
  methods: {
    loadUserTaskTypes() {
      this.service && this.service.get('/userTaskType/loadUserTaskTypes').then(userTypes => {
        this.userTypes = userTypes;
      });
    },
    change(v) {
      this.$emit('change', v);
    }
  },
  computed: {
    innerValue: {
      get() {
        return this.value;
      },
      set(v) {
        this.change(v);
      },
    },
  }
};
</script>